<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <title>申请项目</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" type="text/css" href="/frontdesk/css/common.css">
    <link rel="stylesheet" href="/frontdesk/css/search.css">
    <script src="/frontdesk/js/jquery-3.3.1.js"></script>
    <th:block th:replace="/backstage/common_resources::common_css"></th:block>
    <th:block th:replace="/backstage/common_resources::common_js"></th:block>

    <style>
        form {
            /* 居中 */
            margin: 10px auto;
            width: 1200px;
            height: 1000px;
            background-color: #fff;
            border-radius: 5px;
            padding: 20px;
            border: 1px solid #0fb386;
        }

        .Pname,
        .Puser,
        .staust,
        .Pcontent {
            clear: both;
            width: 200px;
            height: 40px;
            border-radius: 5px;
            border: 1px solid #ccc;
            padding-left: 10px;
            margin: 10px 10px 90px 0;
            background-color: #0fb386;
            color: white;
            line-height: 40px;
            font-size: 16px;
        }

        .Pname .input,
        .Puser .input,
        .staust .input,
        .Pcontent .input {
            width: 500px;
            height: 30px;
            border-radius: 5px;
            border: 1px solid #ccc;
            padding-left: 10px;
            margin: 10px;
            background-color: #0c78d6;
            color: white;
            margin-top: 30px;
        }

        .Ptext p {
            color: black;
        }

        .subBtn {
            position: relative;
            top: 330px;
        }

        .subBtn button {
            background-color: #0fb386;
            height: 50px;
            width: 150px;
            border-radius: 25px;
            color: #fff;
            font-weight: bold;
        }
    </style>
</head>

<body>
    <header th:replace="~{/frontdesk/header::header}"></header>
    <div>

        <div>

            <!-- 内容头部 /-->

            <!-- 正文区域 -->
            <section>
                <!--基础控件-->
                <div class="data-type">



                    <form th:action="@{/frontdesk/project/add}" method="post">
                        <div class="all">
                            <div class="Pname">
                                <div class="">项目名：</div>
                                <div class="input">
                                    <input type="text" class="form-control" placeholder="项目名" name="projectName">
                                </div>
                            </div>
                            <div class="Puser">
                                <div class="">申请人：</div>
                                <div class="input">
                                    <input type="text" class="form-control" placeholder="申请人" name="applicant">
                                </div>
                            </div>
                            <div class="staust">
                                <div class="">审核状态：</div>
                                <div class="input">
                                    <select class="form-control" name="status">
                                        <option value="false">待审核</option>
                                    </select>
                                </div>
                            </div>
                            <div class="Pcontent">
                                <div class="">项目内容：</div>
                                <div class="Ptext" style="height:500px; width: 1130px;margin-top: 30px;">
                                    <div id="div1"></div>
                                    <textarea id="text1" style="width:100%; height:200px;" name="projectDesc"
                                        hidden></textarea>
                                    <script>
                                        const E = window.wangEditor;

                                        const editor = new E('#div1');

                                        const $text1 = $('#text1');

                                        editor.customConfig.onchange = function (html) {

                                            // 第二步，监控变化，同步更新到 textarea

                                            $text1.val(html)

                                        }

                                        // 配置所有菜单

                                        editor.customConfig.menus = [

                                            'head', // 标题

                                            'bold', // 粗体

                                            'fontSize', // 字号

                                            'fontName', // 字体

                                            'italic', // 斜体

                                            'underline', // 下划线

                                            'foreColor', // 文字颜色

                                            'backColor', // 背景颜色

                                            'justify', // 对齐方式

                                            'image', // 插入图片

                                            'undo', // 撤销

                                        ]

                                        // 配置服务器上传地址

                                        // editor.customConfig.uploadImgServer = '/backstage/gramtoo/upload';

                                        // 配置上传图片的参数名

                                        // editor.customConfig.uploadFileName = "file";


                                        editor.create();

                                        // 第一步，初始化 textarea 的值

                                        $text1.val(editor.txt.html());
                                    </script>
                                </div>
                            </div>
                        </div>
                        <div class="subBtn text-center">
                            <button type="submit" class="btn">提交</button>
                            <!--                        <button type="button" class="btn bg-default" onclick="history.back(-1);">返回</button>-->
                        </div>
                    </form>

                </div>

                <!--基础控件/-->



            </section>
            <!-- 正文区域 /-->

        </div>
    </div>
    <!--<footer th:replace="~{/frontdesk/footer::footer}"></footer>-->
    <script>
        // 获取所有的li元素  
        const navItems = document.querySelectorAll('.nav li');

        // 移除其他li元素的active类名  
        navItems.forEach(li => {
            li.classList.remove('nav-active');
        });
        navItems[3].classList.add('nav-active')
        // 跳转到指定的路径  
        // window.location.href = this.querySelector('a').getAttribute('href');
    </script>
</body>

</html>